<!--
 * @Author: wangming
 * @Date: 2021-04-08 15:17:17
 * @LastEditors: wangming
 * @LastEditTime: 2022-04-18 18:15:00
 * @Description: file content
-->
<template>
  <div>
    <div class="ks-row-middle mb20 lh1">
      <div class="mr10 g3">添加按钮</div>
      <i
        class="el-icon-circle-plus-outline iconcolor f20 poi"
        @click="addTag"
      ></i>
    </div>
    <div>
      <el-tag
        class="mb5 ml5"
        v-for="(tag, index) in value.children"
        :key="index"
        :closable="tag.tagName === 'hlButton'"
        @close="value.children.splice(index, 1)"
      >
        {{ tag.name }}
      </el-tag>
    </div>
  </div>
</template>

<script>
import basicmixins from "./basicmixins";
import { cloneDeep } from "lodash";
import { uuid } from "@/utils/common.js";
import { btnTemplate } from "@/pageConfig/index";
export default {
  mixins: [basicmixins],
  methods: {
    addTag() {
      let btn = cloneDeep(btnTemplate);
      //table内特殊标识
      if (/^hlcustomBtn/.test(this.value.key)) {
        let tablekey = this.value.key.replace("hlcustomBtn", "");
        btn.key = "table_btn_" + uuid(3) + tablekey;
      } else {
        btn.key = "btn_" + uuid(3);
      }
      this.value.children.push(btn);
    },
  },
};
</script>

<style lang="scss" scoped></style>
